<template>
<el-drawer :title="formDrawer.title" :visible.sync="formDrawer.visible" direction="rtl" custom-class="drawer-right-side" :before-close="closeDrawer" append-to-body>
    <el-form  class="ruleForm" ref="ruleForm" :model="ruleForm" :rules="rules" label-position="top" label-width="150px">
        <el-form-item label="预产期" prop="event_date" required>
            <el-date-picker v-model="ruleForm.event_date" type="date" value-format="yyyy-MM-dd" placeholder="请填写预产期"></el-date-picker>
        </el-form-item>

        <el-form-item label="门店" prop="store_id" required>
            <picker-view type="store" v-model="ruleForm.store_id" @change="changeStore" tips="请选择酒店"></picker-view>
        </el-form-item>

        <el-form-item label="合同总额" prop="totals" required>
            <el-input type="number" v-model="ruleForm.totals" placeholder="请输入合同总金额"></el-input>
        </el-form-item>

        <el-form-item label="备注" prop="remark">
            <el-input type="textarea" v-model="ruleForm.remark" placeholder="请输入订单备注信息"></el-input>
        </el-form-item>

        <el-form-item label="合同附件" prop="files" required>
            <upload-files ref="filesRef" v-model="ruleForm.files"></upload-files>
        </el-form-item>

        <el-form-item label="其它附件" prop="images">
            <upload-files ref="imagesRef" v-model="ruleForm.images"></upload-files>
        </el-form-item>

        <div class="fixed-bottom" style="width:30vw">
            <el-button type="primary" @click="submit">提交并保存</el-button>
        </div>
    </el-form>
</el-drawer>
</template>

<script>
import pickerView from "@/components/picker/select.vue";
import {
    orderForm
} from '@/views/order/components/config/create-order.js';
import {
    getPickerApi
} from '@/api/system/dictionary/dictionary.js'
import {
    getStoreHallListApi
} from '@/api/system/dictionary/hall.js';
import uploadFiles from '@/components/upload/files.vue';
import {updateOrderApi} from '@/api/order/order.js';

export default {
    components: {
        pickerView,
        uploadFiles
    },
    data() {
        return {
            formDrawer: {
                title: "编辑订单信息",
                visible: false,
            },
            ruleForm: JSON.parse(JSON.stringify(orderForm)),
            collectTypeTitles: {
                1: "定金",
                2: "中款",
                3: "尾款",
            },
            collectDateTitles: {
                1: "定金收款日期",
                2: "中款收款日期",
                3: "尾款收款日期",
            },
            hallList: [],
            banquetTypeList: [],
            rules: {
                category_id: [{
                    required: true,
                    message: "请选择订单类型",
                    trigger: "change",
                }],
                company_id: [{
                    required: true,
                    message: "请选择签约公司",
                    trigger: "change",
                }],
                cooperation_id: [{
                    required: true,
                    message: "请选择合作模式",
                    trigger: "blur",
                }],
                sign_date: [{
                    required: true,
                    message: "请选择签单日期",
                    trigger: "change"
                }],
                event_date: [{
                    required: true,
                    message: "请选择预产期",
                    trigger: "blur",
                }],
                store_id: [{
                    required: true,
                    message: "请选择酒店",
                    trigger: "change",
                }],
                hall_id: [{
                    required: true,
                    message: "请选择厅",
                    trigger: "change"
                }],
                banquet_type_id: [{
                    required: true,
                    message: "请选择",
                    trigger: "change"
                }],
                totals: [{
                    required: true,
                    message: "请录入合同金额",
                    trigger: "blur"
                }],
                files: [{
                    required: true,
                    message: "请上传合同凭证",
                }],
            },
        }
    },
    computed: {
        orderModel: function () {
            if (this.ruleForm.category.order_model) {
                return this.ruleForm.category.order_model;
            } else {
                return 'Banquet';
            }
        },
    },
    created() {
        this.getBanquetTypeList();
    },
    methods: {
        showDrawer(order) {
            this.ruleForm = order;
            this.changeStore();
            this.formDrawer.visible = true;
        },
        closeDrawer() {
            this.formDrawer.visible = false;
        },
        setTotal() {
            let totals = this.ruleForm.collects.reduce((sum, item) => sum + parseFloat(item.price || 0), 0);
            this.ruleForm.totals = totals;
        },
        changeCategory(e) {
            this.ruleForm.category = e;
        },
        changeCompany(e) {
            this.ruleForm.company = e;
        },
        changeStore() {
            getStoreHallListApi({
                store_id: this.ruleForm.store_id
            }).then(res => {
                this.hallList = res.data.list;
            })
        },
        getBanquetTypeList() {
            getPickerApi({
                type: "banquetType"
            }).then(res => {
                this.banquetTypeList = res.data.list
            })
        },
        clearUploadCache() {
            this.$nextTick(() => {
                this.$refs['filesRef'].clearFiles();
            })
        },
        submit() {
            this.$refs['ruleForm'].validate(valid => {
                if (!valid) {
                    return false;
                }
                updateOrderApi(this.ruleForm).then(res=>{
                    if (res.code == 200) {
                        this.$message.success(res.msg);
                        this.closeDrawer();
                    } else {
                        this.$message.warning(res.msg)
                    }
                })
            })
        }
    }
}
</script>@/api/system/dictionary/room.js